/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow
 */

import React, { Fragment } from 'react';
import {
  SafeAreaView,
  StyleSheet,
  ScrollView,
  View,
  Text,

  Button,
  AsyncStorage,
  StatusBar,
} from 'react-native';
import { TextInput } from 'react-native-gesture-handler';
import DataStore from '../expand/dao/DataStore'

const KEY = 'value_key'
export default class DataStoreDemoPage extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      showText: ''
    }
    this.dataStore = new DataStore()
  }

  loadData() {
  
    let url = `https://api.github.com/search/repositories?q=${this.value}`

   this.dataStore.fetchData(url)
        .then(data=>{
            let showData=`初次数据加载时间：${new Date(data.timestamp)}\n${JSON.stringify(data.data)}`
            this.setState({
                showText:showData
            })
        })
        .catch(error=>{
            error && console.log(error.toString())
        })
  }

  


  render() {
    return (
      <View style={styles.sectionContainer}>
        <Text style={styles.welcome}>离线缓存框架使用</Text>

          <TextInput
            style={styles.input}
            onChangeText={text => {
              this.value = text
            }}
          />
          <Button
              title={'获取'}
              onPress={() => {
                this.loadData()
              }}
            />
          

        <Text >{this.state.showText}</Text>
      </View>
    )
  }

};

const styles = StyleSheet.create({

  sectionContainer: {
    marginTop: 32,
    paddingHorizontal: 24,
  },
  sectionTitle: {
    fontSize: 24,
    fontWeight: '600',
    color: '#333',
  },
  inputWrap: {
    flexDirection: 'row',
    alignItems: 'center'
  },
  input: {
    marginRight: 30,
    height: 40,
    lineHeight: 40,
    borderColor: 'black',
    borderWidth: 1
  }

});


